﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>免费测斑</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <link rel="stylesheet" href="../css/mui.min.css">
    <script src="../uploader/js/lrz.bundle.js"></script>
    <script src="../uploader/js/jquery.js"></script>
    <script src="../uploader/js/upload.js"></script>

    <!--引入JS-->
<style>
     li{
        list-style-type:none;
        width:150px;
    }
</style>
</head>
<body>
<div class="mui-content" style="height: 650px;">
    <div class="headage"></div>
    <div class="mui-content-padded" >
        <img src="../images/mfcb.png" style="width:100%;text-align: center;height: 120px;"/>
    </div>

    <div class="container">
<ul style="width: 100%;height: 160px;">
    <li style="float: left;width: 50%">
        <p style="text-align: center;"><label>正面照</label><label style="color: crimson;">*</label></p>
        <div id="drop_area" ></div>
    </li>
    <li style="float: left;width: 48%;">
        <p style="text-align: center;"><label>示例图</label><label style="color: crimson;">*</label></p>
        <div>
            <img src="../images/free.jpg" width="150px" height="150px">
        </div>
    </li>
</ul>
        <ul style="width: 100%;height: 160px;">
            <li style="float: left;width: 50%">
                <p style="text-align: center;"><label>左侧面照</label><label style="color: crimson;">*</label></p>
        <div id="drop_area0"></div>
            </li>
            <li style="float: left;width: 48%">
                <p style="text-align: center;"><label>右侧面照</label><label style="color: crimson;">*</label></p>
        <div id="drop_area1"></div>
            </li>
        </ul>
    </div>
    <div style="width: 100%;display: none;" id="bt">
        <button type="button" class="mui-btn mui-btn-primary" id="save"  style="width: 80%;height: 35px;float: left;margin-left: 10%;margin-top: 20px;">提交检测</button>

    </div>
    <div style="width: 100%;">

        <label style="color: #8f8f94; font-size: 13px!important;text-align: center;width: 100%!important;float: left;">温馨提示：请按<a href="javascript:void(0);" style="color: #8190AE;font-size: 13px;">&nbsp;示例图</a>标准拍照</label>
    </div>
    <div class="footerpage">
    </div>
</div>
</body>
<script src="../js/mui.min.js"></script>
<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/cookieutil.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/getUrlParam.js"></script>
<script src="../uploader/js/uploaderutils.js"></script>
<script>
    $(function(){
        imglist="";
        $(".headage").load("head.html");
        $(".footerpage").load("footer.html");
          Count=3;
        /*公共部分
         * 导航栏
         * footer CopyRight
         */
        var dragImgUpload = new DragImgUpload("#drop_area",{
            callback:function (files) {
                //回调函数，可以传递给后台等等
                var file = files;
                console.log(file.name);
                console.log(file)
                 saveimg(file,"正面照",0);
            }
        })
        var dragImgUpload0 = new DragImgUpload("#drop_area0",{
            callback:function (files) {
                //回调函数，可以传递给后台等等
                var file = files;
                console.log(file.name);
                saveimg(file,"左面照",1);
            }
        })

        var dragImgUpload1 = new DragImgUpload("#drop_area1",{
            callback:function (files) {
                //回调函数，可以传递给后台等等
                var file = files;
                console.log(file.name);
                saveimg(file,"右面照",2);
                setTimeout(function(){
                    $("#bt").attr("style","display:block;");
                }, 2000);
            }
        })

        $("#save").click(function () {
            if (imglist == "" || imglist == null || imglist == undefined) {
                mui.toast('请按要求上传 图片！');
                return;
            }
            var userid = getCookie('userid');
            var mobile = getCookie('mobile');
            var address = getCookie('address');
            // if (mobile == "" || mobile == null || mobile == undefined || address == "" || address == null || address == undefined) {
            //     mui.toast('个人基本信息不完善！请去个人中心修改');
            //     window.history.back(-1);
            // }
            mui.post('/Order/insertFreeByUpuserid',
                {
                    userid: userid,
                    preimages: imglist,
                },
                function (data) {
                    console.log(data);
                    if (data.code) {
                        //mui.toast('资料提交成功请你等待审核！');
                        var btnArray = ['取消', '确定'];
                        mui.confirm('关注公众号获取结果！', '检测中......', btnArray, function(e) {
                            if (e.index == 1) {
                                window.location.href="https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzI0MjE1NzgwMw==&amp;mid=2648911424&amp;idx=1&amp;sn=3323c09b9f823bfb616c3645b9a2ea10&amp;chksm=f1171fc4c66096d26337e6acef5d2fd9a07fcd9d312662586a1e68936508f0fbf6fb6d55c60d#rd#wechat_redirect";
                            } else {
                                window.history.back(-1);
                            }
                        })
                    }
                }, 'json'
            )
        })
    });
</script>
</html>